<template>
    <div class="m-header flex-box flex-ac flex-pj">
        <div class="flex-box flex-ac he-fv" @click="winclose">
            <div class="arrow_left_s arrow_left_i"></div>
        </div>
        <h1 class="text">{{ msg }}</h1>
        <div class="flex-box flex-ac he-fv">
            <div class="arrow_left_s"></div>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
export default {
    props: {
        msg : String,
        close : String
    },
    methods: {
        winclose() {
            this.$toastClose()
            if(this.close == 'lottery'){
                // 彩票订单页面返回提示
                const _this = this // 需要注意 onCancel 和 onConfirm 的 this 指向
                this.$vux.confirm.show({
                    // 组件除show外的属性
                    content: '确定清除当前已选投注并退出？',
                    cancelText: '取消',
                    confirmText: '确定',
                    hideOnBlur: true,
                    onCancel () {
                    },
                    onConfirm () {
                        _this.$router.go(-1)
                    }
                }) 
            }else{
                this.$router.go(-1)
            }
        }
    }
}
</script>

<style scoped lang="stylus" rel="stylesheet/stylus">
@import "~common/stylus/variable" 
    .m-header
        background: $color-r
        position: relative
        height: 2.75rem
        text-align: center
        color: white
    .arrow_left_s
        width: .75rem
        height: 1.25rem
        margin: 0 1rem
    .arrow_left_i
        background-repeat: no-repeat
        background-size: 100% 100%
        background-image: url('../common/image/arrow_left.png')
    .text
        display: inline-block
        vertical-align: top
        line-height: 2.75rem
        font-size: $fonts-18 
</style>